//数据看板
.dataBoardWrapper{
  display: flex;
  border-radius: 8px;
  background: rgba(22, 93, 255, 0.8);
}

.dataBoardItem{
  flex:1;
  padding: 16px 0 16px 30px;
  color:#FFFFFF;

  :global{
    .title{
      font-size: 16px;
      color: rgba(255, 255, 255, 0.6);
      span{
        font-size:12px;
        transform: scale(0.8);
        margin-left:4px;
      }
    }
    .orderNum{
      margin-top:8px;
      font-size: 26px;
      font-weight: 700;
      cursor: pointer;
    }
  }
  &:hover{
    opacity: 1;
    border-radius: 8px;
    background: rgba(22, 93, 255, 1);
    :global{
      .title{
        color: rgba(255, 255, 255, 1);
      }
    }
  }
}

//基础设置流程
.basicProcessWrapper{
  border-radius: 10px;
  background: #F4F7FF;
  padding: 20px 30px;
  :global{
    .subTitle{
      font-size: 18px;
      font-weight: 500;
      color:#1D2129;
      margin-bottom:20px;
    }
  }
}

.processFlexContent{
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 100%;
  :global{
    .processItem{
      width:140px;
      display: flex;
      align-items: center;
    }
    .leftIcon{
      width:48px;
      height:48px;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-right:10px;
    }
    .rightText{
      p{
        font-size: 14px;
        font-weight: 500;
        margin-bottom: 6px;
      }
      span{
        font-size: 18px;
        font-weight: 500;
        cursor: pointer;
        position: relative;
        padding-bottom:8px;
        ul{
          width: 112px;
          font-size:16px;
          margin:0;
          padding:8px 11px;
          color:#333;
          background: #FFFFFF;
          box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.16);
          display: none;
          position: absolute;
          left:-8px;
          top:28px;
          border-radius: 8px;
          letter-spacing: .5px;
          font-weight: normal;
          li{
            padding:3px;
          }
          li:hover{
            color:#165DFF;
          }
        }
        &:hover{
          color:#165DFF;
          ul{
            display: block;
          }
        }
      }
    }
    .gapItem{
      // flex:1;
      width:24px;
      span{
        display: flex;
      }
    }
  }
}

@media screen and (max-width:1100px){
  .processFlexContent{
    :global{
      .leftIcon{
        margin-right: 6px;
      }
    }
  }
}

.specItem{
  :global{
    .imgWrapper{
      display: inline-flex;
      justify-content: center;
      align-items: center;
      width: 16px;
      margin-left:4px;
      img{
        width: 100%;
        display: block;
      }
    }
  }
}

//基础工具
.toolsWrapper{
  position: relative;
}

.toolsItem{
  display: flex;
  align-items: center;
  margin-bottom: 24px;
  :global{
    .textSection{
      flex:1;
      display: flex;
      align-items: center;
      color:#1D2130;
    }
    .toolIcon{
      font-size:36px;
      margin-right: 15px;
    }
    .downloadBtn {
      font-size:14px;
      color:#165DFF;
      padding:5px 15px;
      background-color: #ECF2FF;
      border:0.5px solid #ECF2FF;  
      border-radius: 18px;
      cursor: pointer;
      &:hover{
        border:0.5px solid #165DFF;  
      }
    }
    .specBtn{
      img{
        position: absolute;
        left:0;
        top:0;
        height:100%;
        display: none;
      }
      &:hover{
        img{
          display: block;
        }
      }
    }
  }
}

//产品更新
.articleWrapper{
  :global{
    .articleItem{
      display: flex;
      justify-content: space-between;
      margin-bottom:16px;
      color:#4E5969;
      cursor: pointer;
      .articleTitle{
        flex: 1;
      }
      .articleTime{
        margin-left:12px;
        font-size:13px;
      }
      &:hover{
        color:#165DFF;
      }
    }
  }
}

.downloadModal{
  :global {
    .ant-modal-header {
      padding-top: 22px;
      background: #ffffff !important;
      border: none;
    }
    .ant-modal-title {
      padding-left: 27px !important;
      color: #1d2129;
      font-size: 18px;
      line-height: 20px !important;
      text-align: left !important;
    }
    .ant-modal-close {
      top: 12px !important;
      right: 27px !important;
    }
    .ant-modal-content {
      background: #ffffff !important;
    }
    .ant-modal-footer {
      background: #ffffff !important;
    }
  }
}

.customAlert{
  height: 36px;
  line-height: 36px;
  border-radius: 8px;
  background: #F4F7FF;
  text-indent: 8px;
  color:#4E5969;
  margin-top:4px;
  :global{
    .anticon{
      background:#F4F7FF;
      color: #165DFF;
    }
  }
}

.subTitle{
  font-weight: bold;
  margin:30px 0 18px 0;
}

.printerBox{
  display: flex;
  flex-wrap: wrap;
  :global{
    .printerItem {
      color:#B1B7C3;
      font-size:14px;
      width: 132px;
      height: 36px;
      line-height: 36px;
      text-align: center;
      background-color: #F8FAFF;
      border:0.5px solid #F8FAFF;
      margin:0 12px 16px 0;
      border-radius: 18px;
      cursor: pointer;
      &:hover{
        color:#165DFF;
        border:0.5px solid #165DFF;  
      }
    }
  }
}